<template>
  <div>
    <!-- 导航栏 -->
    <van-nav-bar title="黑马优购" fixed>
      <div class="left_arrow" @click="()=>{ $router.go(-1) }" slot="left">
        <van-icon name="arrow-left"/>
        <span style=" color:#fff ">返回</span>
      </div>
    </van-nav-bar>
    <van-address-list
      style="margin-top:30px"
      v-model="chosenAddressId"
      :list="list"
      :disabled-list="disabledList"
      disabled-text="以下地址超出配送范围"
      default-tag-text="默认"
      @add="onAdd"
      @edit="onEdit"
    />
  </div>
</template>

<script>
export default {
  data() {
    return {
      chosenAddressId: "1",
      list: [
        {
          id: "1",
          name: "张三",
          tel: "13000000000",
          address: "浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室"
        },
        {
          id: "2",
          name: "李四",
          tel: "1310000000",
          address: "浙江省杭州市拱墅区莫干山路 50 号"
        }
      ],
      disabledList: [
        {
          id: "3",
          name: "王五",
          tel: "1320000000",
          address: "浙江省杭州市滨江区江南大道 15 号"
        }
      ]
    };
  },
  methods: {
    onAdd() {
      this.$router.push("/address_edit");
    },
    onEdit(item, index) {
      this.$Toast("编辑地址:" + index);
    }
  },
  created() {
    this.list.push(JSON.parse(window.sessionStorage.getItem("address")));
  }
};
</script>

<style lang="less" scoped>
.van-nav-bar {
  background-color: #d81e06;
}
.van-nav-bar__title {
  color: #fff;
  font-size: 16px;
}

.van-icon::before {
  display: inline-block;
  color: #fff;
}
</style>